<template>
  <a-drawer width="1100px" placement="right" :title="title" :visible="visible" :bodyStyle="{ padding: '1px' }"
    @close="cancel">
    <div class="eip-drawer-body beauty-scroll">
      <a-spin :spinning="spinning">
        <a-tabs default-active-key="1" @change="changeTab" tab-position="left">
          <a-tab-pane key="1" :forceRender="true">
            <span slot="tab"> <a-icon type="form" />基本 </span>
            <div class="tab-margin">
              <a-form-model ref="form" :model="base" :rules="rules" :label-col="config.labelCol"
                :wrapper-col="config.wrapperCol">
                <a-row>
                  <a-col>
                    <a-form-model-item label="名称" prop="title">
                      <a-input v-model="base.title" placeholder="请输入名称" allow-clear />
                    </a-form-model-item>

                    <a-form-model-item label="表单" prop="formId">
                      <a-select placeholder="请选择表单" allow-clear v-model="base.formId" @change="formChange">
                        <a-select-option v-for="(item, i) in forms" :key="i" :value="item.configId">{{ item.name
                        }}</a-select-option>
                      </a-select>
                    </a-form-model-item>
                    <a-form-model-item label="标题" prop="titleruleTxt">
                      <a-input v-model="base.titleruleTxt" placeholder="请输入标题">
                        <a-icon @click="titleRuleClick" slot="addonAfter" type="setting" />
                      </a-input>
                    </a-form-model-item>
                    <a-form-model-item label="历史意见" prop="isopinion">
                      <a-switch checked-children="显示" un-checked-children="不显示" v-model="base.isopinion" />
                    </a-form-model-item>
                    <a-form-model-item label="是否归档" prop="isarchive">
                      <a-switch checked-children="归档" un-checked-children="不归档" v-model="base.isarchive" />
                    </a-form-model-item>
                  </a-col>
                </a-row>
              </a-form-model>
            </div>
          </a-tab-pane>

          <a-tab-pane key="3" :forceRender="true">
            <span slot="tab"> <a-icon type="ordered-list" />按钮 </span>
            <div class="tab-margin">
              <vxe-table ref="tableButton" id="workflowactivitybutton" size="small" row-id="buttonId"
                :tooltip-config="{ showAll: true }" :height="button.height" :data="button.data">
                <vxe-table-column type="seq" title="序号" align="center" width="60"></vxe-table-column>
                <vxe-table-column field="showPc" title="PC显示" align="center" width="80">
                  <template v-slot="{ row }">
                    <a-switch :checked="row.showPc" @change="row.showPc = !row.showPc" />
                  </template>
                </vxe-table-column>
                <vxe-table-column field="showMobile" title="移动端" align="center" width="80">
                  <template v-slot="{ row }">
                    <a-switch :checked="row.showMobile" @change="row.showMobile = !row.showMobile" />
                  </template>
                </vxe-table-column>

                <vxe-table-column field="name" title="标题" width="150">
                  <template #default="{ row }">
                    <a-input v-model="row.name"></a-input>
                  </template>
                </vxe-table-column>
                <vxe-table-column field="script" title="事件" width="150">
                  <template #default="{ row }">
                    <a-input v-model="row.script"></a-input>
                  </template>
                </vxe-table-column>
                <vxe-table-column field="name" title="按钮" width="150">
                  <template v-slot="{ row }">
                    <a-button :type="row.type">
                      <a-icon :type="row.icon" :theme="row.theme" />
                      {{ row.name }}</a-button>
                  </template>
                </vxe-table-column>
                <vxe-table-column field="remark" title="备注" width="350" show-overflow="ellipsis"></vxe-table-column>
              </vxe-table>
            </div>
          </a-tab-pane>

          <a-tab-pane key="4" :forceRender="true">
            <span slot="tab"> <a-icon type="unordered-list" />字段权限 </span>
            <div class="tab-margin">
              <div style="padding: 10px 0">
                <a-button type="primary" @click="columnReset">字段重置</a-button>
              </div>
              <vxe-table ref="tableColumn" id="workflowactivitycolumn" size="small" :height="column.height"
                :data="column.data" :tooltip-config="{ showAll: true }">
                <vxe-table-column type="seq" align="center" title="序号" width="60"></vxe-table-column>
                <vxe-table-column field="name" title="字段名" width="180" showOverflow="ellipsis"></vxe-table-column>
                <vxe-table-column field="description" title="说明" width="180" showOverflow="ellipsis"></vxe-table-column>
                <vxe-table-column field="isRead" title="读" align="center" width="80">
                  <template v-slot="{ row }">
                    <a-switch :checked="row.isRead" @change="row.isRead = !row.isRead" />
                  </template>
                </vxe-table-column>
                <vxe-table-column field="isWrite" title="写" align="center" width="80">
                  <template v-slot="{ row }">
                    <a-switch :checked="row.isWrite" @change="row.isWrite = !row.isWrite" />
                  </template>
                </vxe-table-column>
                <vxe-table-column field="isDelete" title="删" align="center" width="80">
                  <template v-slot="{ row }">
                    <a-switch :checked="row.isDelete" @change="row.isDelete = !row.isDelete" />
                  </template>
                </vxe-table-column>
                <vxe-table-column field="isHide" title="隐藏" align="center" width="80">
                  <template v-slot="{ row }">
                    <a-switch :checked="row.isHide" @change="row.isHide = !row.isHide" />
                  </template>
                </vxe-table-column>
                <vxe-table-column field="isDefault" title="默认值" align="center" width="80">
                  <template v-slot="{ row }">
                    <a-switch :checked="row.isDefault" @change="row.isDefault = !row.isDefault" />
                  </template>
                </vxe-table-column>
                <vxe-table-column title="验证规则" width="100" align="center">
                  <template v-slot="{ row }">
                    <a-badge dot v-if="row.validator && row.validator.length > 0">
                      <a-button type="primary" @click="setValidator(row)">验证</a-button>
                    </a-badge>
                    <a-button v-else type="primary" @click="setValidator(row)">验证</a-button>
                  </template>
                </vxe-table-column>
              </vxe-table>
            </div>
          </a-tab-pane>

          <a-tab-pane key="5" :forceRender="true">
            <span slot="tab"> <a-icon type="sound" />通知 </span>
            <div class="tab-margin">
              <vxe-table ref="tableNotice" id="workflowactivitynotice" size="small" :height="notice.height"
                :data="notice.data">
                <vxe-table-column type="seq" title="序号" align="center" width="60"></vxe-table-column>
                <vxe-table-column width="80" align="center">
                  <template #header>
                    <a-button type="primary" size="small" @click="noticeAdd">
                      <a-icon type="plus" />
                    </a-button>
                  </template>
                  <template #default="{ row }">
                    <a-popconfirm title="确定删除通知?" ok-text="确定" cancel-text="取消" @confirm="noticeDel(row)">
                      <a-button size="small" type="danger">
                        <a-icon type="delete" />
                      </a-button>
                    </a-popconfirm>
                  </template>
                </vxe-table-column>
                <vxe-table-column field="remark" title="备注" width="150">
                  <template v-slot="{ row }">
                    <a-input placeholder="请输入备注" v-model="row.remark" />
                  </template>
                </vxe-table-column>
                <vxe-table-column field="use" title="启用" width="60" align="center">
                  <template v-slot="{ row }">
                    <a-switch checked-children="是" un-checked-children="否" v-model="row.use" />
                  </template>
                </vxe-table-column>
                <vxe-table-column field="userchosen" title="用户选择" width="130" align="center">
                  <template v-slot="{ row }">
                    <a-switch checked-children="是" un-checked-children="否" v-model="row.userchosen" />
                  </template>
                </vxe-table-column>
                <vxe-table-column field="trigger" title="触发类型" align="center" width="180">
                  <template v-slot="{ row }">
                    <a-select v-model="row.trigger">
                      <a-select-option :value="0">下一步成功</a-select-option>
                      <a-select-option :value="1">退回成功</a-select-option>
                      <a-select-option :value="2">拒绝成功</a-select-option>
                    </a-select>
                  </template>
                </vxe-table-column>
                <vxe-table-column title="设置" align="center">
                  <template v-slot="{ row }">
                    <a-space size="small">
                      <a-select style="width: 160px" v-model="row.type" @change="noticeTypeChange(row)">
                        <a-select-option :value="0">邮件</a-select-option>
                        <a-select-option :value="1">站内</a-select-option>
                        <a-select-option :value="2">短信</a-select-option>
                        <a-select-option :value="3">微信公众号</a-select-option>
                        <a-select-option :value="4">微信小程序</a-select-option>
                        <a-select-option :value="5">企业微信</a-select-option>
                        <a-select-option :value="6">QQ</a-select-option>
                        <a-select-option :value="7">钉钉</a-select-option>
                        <a-select-option :value="8">App</a-select-option>
                      </a-select>
                      <a-badge dot v-if="row.config">
                        <a-button @click="noticeSetting(row)">
                          <a-icon type="setting" />
                        </a-button>
                      </a-badge>
                      <a-button v-else @click="noticeSetting(row)">
                        <a-icon type="setting" />
                      </a-button>
                    </a-space>
                  </template>
                </vxe-table-column>
              </vxe-table>
            </div>
          </a-tab-pane>

          <a-tab-pane key="6" :forceRender="true">
            <span slot="tab"> <a-icon type="clock-circle" />超时 </span>
            <div class="tab-margin">
              <vxe-table ref="tableOverTime" id="workflowactivitytimeout" size="small" :height="timeout.height"
                :data="timeout.data">
                <vxe-table-column type="seq" title="序号" align="center" width="60"></vxe-table-column>
                <vxe-table-column width="80" align="center">
                  <template #header>
                    <a-button type="primary" size="small" @click="timeoutAdd">
                      <a-icon type="plus" />
                    </a-button>
                  </template>
                  <template #default="{ row }">
                    <a-popconfirm title="确定删除超时?" ok-text="确定" cancel-text="取消" @confirm="timeoutDel(row)">
                      <a-button size="small" type="danger">
                        <a-icon type="delete" />
                      </a-button>
                    </a-popconfirm>
                  </template>
                </vxe-table-column>
                <vxe-table-column field="remark" title="备注" width="250">
                  <template v-slot="{ row }">
                    <a-input placeholder="请输入超时发送事由标题" v-model="row.remark" />
                  </template>
                </vxe-table-column>
                <vxe-table-column field="use" title="启用" width="60" align="center">
                  <template v-slot="{ row }">
                    <a-switch checked-children="是" un-checked-children="否" v-model="row.use" />
                  </template>
                </vxe-table-column>
                <vxe-table-column title="设置" align="center" width="210">
                  <template v-slot="{ row }">
                    <a-space size="small">
                      <a-select @change="timeoutTypeChange(row)" style="width: 140px" v-model="row.type">
                        <a-select-option :value="0">邮件</a-select-option>
                        <a-select-option :value="1">站内</a-select-option>
                        <a-select-option :value="2">短信</a-select-option>
                        <a-select-option :value="3">微信公众号</a-select-option>
                        <a-select-option :value="4">微信小程序</a-select-option>
                        <a-select-option :value="5">企业微信</a-select-option>
                        <a-select-option :value="6">QQ</a-select-option>
                        <a-select-option :value="7">钉钉</a-select-option>
                        <a-select-option :value="8">App</a-select-option>
                      </a-select>
                      <a-badge dot v-if="row.config">
                        <a-button @click="timeoutSetting(row)">
                          <a-icon type="setting" />
                        </a-button>
                      </a-badge>
                      <a-button v-else @click="timeoutSetting(row)">
                        <a-icon type="setting" />
                      </a-button>
                    </a-space>
                  </template>
                </vxe-table-column>
              </vxe-table>
            </div>
          </a-tab-pane>

          <a-tab-pane key="7" :forceRender="true">
            <span slot="tab"> <a-icon type="file-done" />事件 </span>
            <div class="tab-margin">
              <vxe-table ref="tableEvent" id="workflowactivitynotice" size="small" :height="event.height"
                :data="event.data">
                <vxe-table-column type="seq" title="序号" align="center" width="60"></vxe-table-column>
                <vxe-table-column width="80" align="center">
                  <template #header>
                    <a-button size="small" type="primary" @click="eventAdd">
                      <a-icon type="plus" />
                    </a-button>
                  </template>
                  <template #default="{ row }">
                    <a-popconfirm title="确定删除事件?" ok-text="确定" cancel-text="取消" @confirm="eventDel(row)">
                      <a-button size="small" type="danger">
                        <a-icon type="delete" />
                      </a-button>
                    </a-popconfirm>
                  </template>
                </vxe-table-column>
                <vxe-table-column field="remark" title="备注" width="220">
                  <template v-slot="{ row }">
                    <a-input placeholder="请输入事件备注信息" v-model="row.remark" />
                  </template>
                </vxe-table-column>
                <vxe-table-column field="use" title="启用" width="60" align="center">
                  <template v-slot="{ row }">
                    <a-switch checked-children="是" un-checked-children="否" v-model="row.use" />
                  </template>
                </vxe-table-column>
                <vxe-table-column title="触发类型" align="center" width="210">
                  <template v-slot="{ row }">
                    <a-space size="small">
                      <a-select style="width: 180px" v-model="row.type">
                        <a-select-option :value="0">下一步开始前</a-select-option>
                        <a-select-option :value="1">下一步开始后</a-select-option>
                        <a-select-option :value="2">退回开始前</a-select-option>
                        <a-select-option :value="3">退回开始后</a-select-option>
                        <a-select-option :value="4">拒绝开始前</a-select-option>
                        <a-select-option :value="5">拒绝开始后</a-select-option>
                      </a-select>
                    </a-space>
                  </template>
                </vxe-table-column>
                <vxe-table-column title="设置" align="center" width="200">
                  <template v-slot="{ row }">
                    <a-space size="small">
                      <a-select @change="eventTypeChange(row)" style="width: 120px" v-model="row.type">
                        <a-select-option :value="0">JS</a-select-option>
                        <a-select-option :value="1">接口</a-select-option>
                      </a-select>
                      <a-badge dot v-if="row.config">
                        <a-button @click="eventSetting(row)">
                          <a-icon type="setting" />
                        </a-button>
                      </a-badge>
                      <a-button v-else @click="eventSetting(row)">
                        <a-icon type="setting" />
                      </a-button>
                    </a-space>
                  </template>
                </vxe-table-column>
              </vxe-table>
            </div>
          </a-tab-pane>
        </a-tabs>
      </a-spin>
    </div>
    <div class="eip-drawer-toolbar">
      <a-space>
        <a-button key="back" @click="cancel" :disabled="loading"><a-icon type="close" />取消</a-button>
        <a-button key="submit" @click="save" type="primary" :loading="loading"><a-icon type="save" />提交</a-button>
      </a-space>
    </div>
    <eventjs ref="eventjs" v-if="event.setting.js.visible" :visible.sync="event.setting.js.visible"
      :title="event.setting.js.title" :edit="event.setting.value" @ok="eventOk"></eventjs>

    <eventinterface ref="eventinterface" v-if="event.setting.interface.visible"
      :visible.sync="event.setting.interface.visible" :title="event.setting.interface.title" :edit="event.setting.value"
      @ok="eventOk"></eventinterface>

    <validator ref="validator" v-if="validator.visible" :visible.sync="validator.visible" :validator="validator.data"
      :title="validator.title" @ok="validatorOk"></validator>

    <notice-email ref="noticeEmail" v-if="notice.setting.email.visible" :visible.sync="notice.setting.email.visible"
      :column="column.data" :edit="notice.setting.value" title="邮件通知" @ok="noticeOk"></notice-email>

    <notice-ding-talk ref="noticeDingTalk" v-if="notice.setting.dingtalk.visible"
      :visible.sync="notice.setting.dingtalk.visible" :column="column.data" :edit="notice.setting.value" title="钉钉通知"
      @ok="noticeOk"></notice-ding-talk>

    <notice-system ref="noticeSystem" v-if="notice.setting.system.visible" :visible.sync="notice.setting.system.visible"
      :column="column.data" :edit="notice.setting.value" title="站内通知" @ok="noticeOk"></notice-system>

    <notice-sms ref="noticeSms" v-if="notice.setting.sms.visible" :visible.sync="notice.setting.sms.visible"
      :column="column.data" :edit="notice.setting.value" title="短信通知" @ok="noticeOk"></notice-sms>

    <notice-app ref="noticeApp" v-if="notice.setting.app.visible" :visible.sync="notice.setting.app.visible"
      :column="column.data" :edit="notice.setting.value" title="App通知" @ok="noticeOk"></notice-app>

    <timeout-email ref="timeoutEmail" v-if="timeout.setting.email.visible" :visible.sync="timeout.setting.email.visible"
      :column="column.data" :edit="timeout.setting.value" title="邮件通知" @ok="timeoutOk"></timeout-email>

    <timeout-system ref="timeoutSystem" v-if="timeout.setting.system.visible"
      :visible.sync="timeout.setting.system.visible" :column="column.data" :edit="timeout.setting.value" title="站内通知"
      @ok="timeoutOk"></timeout-system>

    <timeout-sms ref="timeoutSms" v-if="timeout.setting.sms.visible" :visible.sync="timeout.setting.sms.visible"
      :column="column.data" :edit="timeout.setting.value" title="短信通知" @ok="timeoutOk"></timeout-sms>

    <timeout-app ref="timeoutApp" v-if="timeout.setting.app.visible" :visible.sync="timeout.setting.app.visible"
      :column="column.data" :edit="timeout.setting.value" title="App通知" @ok="timeoutOk"></timeout-app>

    <title-rule ref="titleRule" v-if="titleRule.visible" :visible.sync="titleRule.visible" :edit="titleRule.value"
      :column="column.data" title="标题规则" @ok="titleRuleOk"></title-rule>
  </a-drawer>
</template>

<script>
import {
  findForm,
  findFormColumns,
  findButton,
} from "@/services/workflow/process/activity/begin";

import eventjs from "./components/event/js";
import eventinterface from "./components/event/interface";
import validator from "@/pages/workflow/process/activity/components/validator/index";
import noticeEmail from "@/pages/workflow/process/activity/components/notice/email";
import noticeSystem from "@/pages/workflow/process/activity/components/notice/system";
import noticeSms from "@/pages/workflow/process/activity/components/notice/sms";
import noticeApp from "@/pages/workflow/process/activity/components/notice/app";

import timeoutEmail from "@/pages/workflow/process/activity/components/timeout/email";
import timeoutSystem from "@/pages/workflow/process/activity/components/timeout/system";
import timeoutSms from "@/pages/workflow/process/activity/components/timeout/sms";
import timeoutApp from "@/pages/workflow/process/activity/components/timeout/app";

import titleRule from "@/pages/workflow/process/activity/components/titlerule/index";

import XEUtils from "xe-utils";
export default {
  components: {
    eventinterface,
    eventjs,
    validator,
    noticeEmail,
    noticeSystem,
    noticeSms,
    noticeApp,

    timeoutEmail,
    timeoutSystem,
    timeoutSms,
    timeoutApp,
    titleRule,
  },
  name: "activityTask",
  data() {
    return {
      itemKey: "1",
      loading: false,
      spinning: false,
      config: {
        labelCol: {
          span: 3,
        },
        wrapperCol: {
          span: 21,
        },
      },
      rules: {
        title: [
          {
            required: true,
            message: "请输入名称",
            trigger: "blur",
          },
        ],
        titleruleTxt: [
          {
            required: true,
            message: "请输入标题",
            trigger: "blur",
          },
        ],
        formId: [
          {
            required: true,
            message: "请选择表单",
            trigger: ["blur", "change"],
          },
        ],
      },
      base: {
        title: "",
        formId: undefined,
        formName: "",
        isopinion: false,
        isarchive: false,
        titlerule: "您有一条待审批流程",
        titleruleTxt: "您有一条待审批流程",
      },

      button: {
        height: this.eipHeaderHeight() - 36 + "px",
        data: [],
        check: [], //选中按钮
      },
      column: {
        height: this.eipHeaderHeight() - 86 + "px",
        data: [],
        row: {},
      },
      notice: {
        height: this.eipHeaderHeight() - 36 + "px",
        data: [],
        setting: {
          value: null,
          email: {
            visible: false,
            title: "",
          },
          system: {
            visible: false,
            title: "",
          },
          sms: {
            visible: false,
            title: "",
          },

          app: {
            visible: false,
            title: "",
          },
          dingtalk: {
            visible: false,
            title: "",
          },
        },
      },
      timeout: {
        height: this.eipHeaderHeight() - 36 + "px",
        data: [],
        setting: {
          value: null,
          email: {
            visible: false,
            title: "",
          },
          system: {
            visible: false,
            title: "",
          },
          sms: {
            visible: false,
            title: "",
          },

          app: {
            visible: false,
            title: "",
          },
          dingtalk: {
            visible: false,
            title: "",
          },
        },
      },
      event: {
        height: this.eipHeaderHeight() - 36 + "px",
        data: [],
        setting: {
          value: null,
          js: {
            visible: false,
            title: "",
          },
          interface: {
            visible: false,
            title: "",
          },
        },
      },
      //验证
      validator: {
        visible: false,
        data: [],
        title: "",
      },
      //标题规则
      titleRule: {
        visible: false,
        value: null,
      },
      tinymce: {
        plugins: "preview  fullscreen code",
        toolbar: "undo redo |fullscreen|code",
        height: 150,
        show: false,
        menubar: "",
      },
      forms: [], //节点配置表单
      obj: {},
    };
  },
  props: {
    visible: {
      type: Boolean,
      default: false,
    },
    data: {
      type: Object,
    },
    formId: {
      type: String,
    }, //默认表单Id
    title: {
      type: String,
    },
  },
  mounted() {
    this.buttonInit();
    this.columnInit();
    this.eventInit();
    this.timeoutInit();
    this.noticeInit();
    this.formInit();
    setTimeout(() => {
      this.tinymce.show = true;
    }, 10);
  },
  methods: {
    /**
     *选项卡改变事件
     */
    changeTab(activeKey) { },

    /**
     *设置规则
     */
    titleRuleClick() {
      this.titleRule.visible = true;
      this.titleRule.value = {
        titlerule: this.base.titlerule,
        titleruleTxt: this.base.titleruleTxt,
      };
    },

    /**
     *规则设置完成
     */
    titleRuleOk(value) {
      this.base.titlerule = value.titlerule;
      this.base.titleruleTxt = value.titleruleTxt;
    },

    /**
     * 取消
     */
    cancel() {
      this.$emit("update:visible", false);
    },

    /**
     * 保存
     */
    save() {
      let that = this;
      this.$refs.form.validate((valid, error) => {
        if (valid) {
          that.loading = true;
          that.spinning = true;
          that.data.props.base = that.base;
          that.data.text.text = that.base.title;
          that.data.props.event = that.event.data;
          that.data.props.timeout = that.timeout.data;
          that.data.props.notice = that.notice.data;
          that.data.props.button = that.button.data.filter(
            (f) => f.showMobile || f.showPc
          );
          that.data.props.column = that.column.data;
          this.$emit("ok", that.data);
          this.cancel();
        } else {
          let messages = [];
          for (const key in error) {
            messages.push(error[key][0].message);
          }
          that.$message.error(messages.join(","));
        }
      });
    },

    /**
     * 初始化表单
     */
    formInit() {
      let that = this;
      findForm({
        useType: 2,
      }).then(function (result) {
        if (result.code === that.eipResultCode.success) {
          that.forms = result.data;
          //其他信息
          if (that.data) {
            that.base = XEUtils.clone(that.data.props.base, true);
            if (!that.base.formId && that.formId) {
              that.base.formId = that.formId;
            }
          } else {
            that.base.formId = that.formId;
          }

          if (that.base.formId) {
            that.columnSync();
          }
        }
      });
    },

    /**
     * 字段初始化
     */
    columnInit() {
      let that = this;
      if (that.data) {
        //默认勾选
        that.column.data = XEUtils.clone(that.data.props.column, true);
      }
    },

    /**
     * 表单切换
     */
    formChange(id) {
      let that = this;
      if (id) {
        that.column.data = [];
        that.columnSync();
      } else {
        this.column.data = [];
      }
    },
    /**
     * 字段重置
     */
    columnReset() {
      let that = this;
      that.column.data = [];
      findFormColumns(this.base.formId).then(function (result) {
        if (result.code === that.eipResultCode.success) {
          result.data.forEach((item) => {
            item.isRead = true;
            item.isWrite = true;
            item.isDelete = true;
            item.isHide = false;
            item.isDefault = false;
            item.validator = [];
            that.column.data.push(item);
          });
        }
      });
    },
    /**
     * 同步字段
     */
    columnSync() {
      let that = this;
      findFormColumns(this.base.formId).then(function (result) {
        if (result.code === that.eipResultCode.success) {
          result.data.forEach((item) => {
            var have = that.column.data.filter((f) => f.name == item.name);
            if (have.length == 0) {
              item.isRead = true;
              item.isWrite = true;
              item.isDelete = true;
              item.isHide = false;
              item.isDefault = false;
              item.validator = [];
              that.column.data.push(item);
            }
          });
        }
      });
    },
    /**
     * 初始化按钮
     */
    buttonInit() {
      let that = this;
      findButton({
        size: 100,
        sord: "asc",
        sidx: "OrderNo",
      }).then(function (result) {
        if (result.code === that.eipResultCode.success) {
          result.data.forEach((item) => {
            item.showPc = false;
            item.showMobile = false;
          });
          that.button.data = result.data;
          if (that.data) {
            that.data.props.button.forEach((item) => {
              var check = that.button.data.filter(
                (f) => f.buttonId == item.buttonId
              );
              if (check.length > 0) {
                check[0].name = item.name;
                check[0].script = item.script;
                check[0].showPc = item.showPc;
                check[0].showMobile = item.showMobile;
              }
            });
          }
        }
      });
    },

    /**
     * 通知初始化
     */
    noticeInit() {
      let that = this;
      if (that.data) {
        that.notice.data = XEUtils.clone(that.data.props.notice, true);
      }
    },

    /**
     * 添加通知
     */
    noticeAdd() {
      this.notice.data.push({
        remark: "",
        use: true, //是否启用
        userchosen: false,
        trigger: 0, //触发类型:下一步成功,退回成功,拒绝成功
        type: 0, //通知类型:邮件,站内,短信,微信,钉钉,QQ,
        config: null, //具体配置
      });
    },
    /**
     *删除
     */
    noticeDel(row) {
      var delIndex = -1;
      this.notice.data.forEach((item, index) => {
        if (item._X_ROW_KEY == row._X_ROW_KEY) {
          delIndex = index;
        }
      });
      if (delIndex != -1) {
        this.notice.data.splice(delIndex, 1);
      }
    },

    /**
     *
     */
    noticeTypeChange(row) {
      row.config = null;
    },

    /**
     * 消息设置
     */
    noticeSetting(row) {
      this.notice.setting.value = row;
      switch (row.type) {
        case 0:
          this.notice.setting.email.visible = true;
          break;
        case 1:
          this.notice.setting.system.visible = true;
          break;
        case 2:
          this.notice.setting.sms.visible = true;
          break;
        case 3:
          this.notice.setting.weixinofficialaccount.visible = true;
          break;
        case 7:
          this.notice.setting.dingtalk.visible = true;
          break;
        case 8:
          this.notice.setting.app.visible = true;
          break;
      }
    },

    /**
     * 消息设置成功
     * @param {*} value
     */
    noticeOk(value) {
      this.notice.setting.value.config = value;
    },

    /**
     * 超时通知
     */
    timeoutAdd() {
      this.timeout.data.push({
        remark: "",
        use: true, //是否启用
        trigger: 0, //触发类型:下一步成功,退回成功,拒绝成功
        type: 0, //通知类型:邮件,站内,短信,微信,钉钉,QQ,
        config: null, //具体配置
      });
    },

    /**
     *超时删除
     */
    timeoutDel(row) {
      var delIndex = -1;
      this.timeout.data.forEach((item, index) => {
        if (item._X_ROW_KEY == row._X_ROW_KEY) {
          delIndex = index;
        }
      });
      if (delIndex != -1) {
        this.timeout.data.splice(delIndex, 1);
      }
    },

    /**
     *
     */
    timeoutTypeChange(row) {
      row.config = null;
    },

    /**
     * 消息设置
     */
    timeoutSetting(row) {
      this.timeout.setting.value = row;
      switch (row.type) {
        case 0:
          this.timeout.setting.email.visible = true;
          break;
        case 1:
          this.timeout.setting.system.visible = true;
          break;
        case 2:
          this.timeout.setting.sms.visible = true;
          break;
        case 8:
          this.timeout.setting.app.visible = true;
          break;
      }
    },

    /**
     * 消息设置成功
     * @param {*} value
     */
    timeoutOk(value) {
      this.timeout.setting.value.config = value;
    },

    /**
     * 超时通知初始化
     */
    timeoutInit() {
      let that = this;
      if (that.data) {
        that.timeout.data = XEUtils.clone(that.data.props.timeout, true);
      }
    },

    /**
     * 事件通知初始化
     */
    eventInit() {
      let that = this;
      if (that.data) {
        that.event.data = XEUtils.clone(that.data.props.event, true);
      }
    },

    /**
     * 事件通知
     */
    eventAdd() {
      this.event.data.push({
        remark: "",
        use: true, //是否启用
        trigger: 0, //触发类型:下一步开始前,下一步开始后,退回开始前,退回开始后,拒绝开始前,拒绝开始后
        type: 0, //通知类型:JS,接口
        config: null, //具体配置
      });
    },

    /**
     *
     */
    eventOk(value) {
      this.event.setting.value.config = value;
    },

    /**
     * 删除
     */
    eventDel(row) {
      var delIndex = -1;
      this.event.data.forEach((item, index) => {
        if (item._X_ROW_KEY == row._X_ROW_KEY) {
          delIndex = index;
        }
      });
      if (delIndex != -1) {
        this.event.data.splice(delIndex, 1);
      }
    },

    /**
     *
     */
    eventTypeChange(row) {
      row.config = null;
    },

    /**
     * 事件配置
     */
    eventSetting(row) {
      this.event.setting.value = row;
      switch (row.type) {
        case 0:
          this.event.setting.js.title = "事件配置-js";
          this.event.setting.js.visible = true;
          break;
        case 1:
          this.event.setting.interface.title = "事件配置-接口";
          this.event.setting.interface.visible = true;
          break;
      }
    },

    /**
     * 设置验证规则
     * @param {*} row
     */
    setValidator(row) {
      this.column.row = row;
      this.validator.data = row.validator;
      this.validator.title = row.description;
      this.validator.visible = true;
    },

    /**
     *验证填写完成
     */
    validatorOk(validator) {
      this.column.row.validator = validator;
    },
  },
};
</script>

<style lang="less" scoped>
.tab-margin {
  margin: 10px;
}

/deep/ .ant-tabs-bar {
  margin: 0 0 4px 0 !important;
}

/deep/ .ant-tabs {
  height: calc(100vh - 110px) !important;
}

/deep/ .ant-tabs .ant-tabs-left-content {
  border-left: 0 !important;
  padding-left: 0 !important;
}
</style>
